<template>
  <div>
    <detailHeader></detailHeader>
    <detailBanner 
      :sightName="sightName" 
      :bannerImg="bannerImg" 
      :gallaryImgs="gallaryImgs">
    </detailBanner>
    <detailList :categoryList='categoryList'></detailList>
  </div>
</template>
<script>
import detailBanner from './components/banner'
import detailHeader from './components/header'
import detailList from './components/list'
import axios from 'axios'
export default {
  name: 'Detail',
  data () {
    return {
      sightName: '',
      bannerImg: '',
      gallaryImgs: [],
      categoryList: [],
    }
  },
  components: {
    detailBanner,
    detailHeader,
    detailList,
  },
  methods: {
    getInfo (response) {//res  为get请求到的数据
			const res = response.data
			if (res.data && res.ret) {
        this.sightName = res.data.sightName
        this.bannerImg = res.data.bannerImg
        this.gallaryImgs = res.data.gallaryImgs
        this.categoryList = res.data.categoryList
			}
		}
  },
  mounted () {
    axios.get('/api/detail.json').then(this.getInfo)
  }
}
</script>
<style scoped>
  .text {
    height: 1000px;
  }
</style>

